JavaScript Temporal API: Moderne dato- og tidshåndtering

JavaScript Date-objektet har lenge vært en kilde til frustrasjon for utviklere. Dets mutabilitet, mangel på innebygd tidssonestøtte og klønete API har ført til utallige biblioteker og omgåelser. Heldigvis har Temporal API som mål å adressere disse manglene, og gir en moderne, intuitiv og tidssonebevisst løsning for dato- og tidsmanipulasjon i JavaScript.

Hva er Temporal API?

Temporal API er et nytt globalt objekt, Temporal, som gir en moderne og standardisert måte å jobbe med datoer og klokkeslett i JavaScript. Det er designet for å erstatte det utdaterte Date-objektet, og tilbyr betydelige forbedringer når det gjelder API-design, uforanderlighet, tidssonestøtte og generell brukervennlighet. Det er en del av ECMAScript-forslaget og blir implementert i store JavaScript-motorer.

Viktige fordeler med Temporal API:

• Uforanderlighet: Temporal-objekter er uforanderlige, noe som betyr at operasjoner på dem returnerer nye objekter i stedet for å endre originalen. Dette bidrar til å forhindre uventede bivirkninger og gjør koden lettere å resonnere om.
• Klart API: API-et er designet for å være mer intuitivt og konsistent enn det utdaterte Date-objektet.
• Tidssonestøtte: Temporal gir robust støtte for tidssoner, slik at du kan jobbe med datoer og klokkeslett på forskjellige steder rundt om i verden.
• Kalenderstøtte: Utover den gregorianske kalenderen, tillater API-et bruk av andre kalendersystemer, noe som forenkler globale applikasjoner.
• Håndtering av skuddsekunder: Temporal API tar hensyn til skuddsekunder, og gir mer nøyaktige tidsberegninger.

Komme i gang med Temporal

Mens Temporal API fortsatt er under utvikling og ennå ikke er fullt støttet i alle nettlesere og Node.js-miljøer, kan du bruke en polyfill for å begynne å eksperimentere med den i dag. Du kan installere polyfill via npm:

            npm install @js-temporal/polyfill
            

              
                Copy
              
            
          

Importer deretter polyfill i JavaScript-koden din:

            import { Temporal } from '@js-temporal/polyfill';
            

              
                Copy
              
            
          

Når polyfill er installert, kan du begynne å bruke Temporal-objektet og dets forskjellige klasser.

Kjerne Temporal-klasser

Temporal API gir flere nøkkelklasser for å jobbe med datoer og klokkeslett:

• Temporal.PlainDate: Representerer en kalenderdato (år, måned og dag) uten tidssone eller klokkeslettinformasjon.
• Temporal.PlainTime: Representerer et klokkeslett (time, minutt, sekund og brøkdel av et sekund) uten dato- eller tidssoneinformasjon.
• Temporal.PlainDateTime: Representerer en dato og et klokkeslett uten tidssoneinformasjon.
• Temporal.ZonedDateTime: Representerer en dato og et klokkeslett med en spesifikk tidssone.
• Temporal.Instant: Representerer et spesifikt tidspunkt, målt i nanosekunder siden Unix-epoken (1. januar 1970, kl. 00:00:00 Coordinated Universal Time (UTC)).
• Temporal.TimeZone: Representerer en tidssone.
• Temporal.Duration: Representerer en tidsvarighet, for eksempel timer, minutter eller sekunder.
• Temporal.Now: Gir tilgang til gjeldende dato og klokkeslett.

Arbeide med PlainDate

Temporal.PlainDate-klassen representerer en dato uten tidssone eller klokkeslettinformasjon. Den er nyttig for å representere fødselsdager, jubileer eller andre datobaserte hendelser.

Opprette en PlainDate:

            const plainDate = Temporal.PlainDate.from({ year: 2024, month: 10, day: 26 });
console.log(plainDate.toString()); // Output: 2024-10-26
            

              
                Copy
              
            
          

Du kan også opprette en PlainDate fra en streng i ISO 8601-format:

            const plainDateFromString = Temporal.PlainDate.from('2024-12-25');
console.log(plainDateFromString.toString()); // Output: 2024-12-25
            

              
                Copy
              
            
          

Få tilgang til datokomponenter:

            const year = plainDate.year; // 2024
const month = plainDate.month; // 10
const day = plainDate.day;   // 26
const dayOfWeek = plainDate.dayOfWeek; // Ukedag (1-7, mandag-søndag)
const dayOfYear = plainDate.dayOfYear; // Dag i året (1-366)
const daysInMonth = plainDate.daysInMonth; // Antall dager i måneden
const isLeapYear = plainDate.isLeapYear;   // Boolsk verdi som indikerer om året er et skuddår
            

              
                Copy
              
            
          

Legge til og trekke fra dager:

            const nextDay = plainDate.add({ days: 1 });
console.log(nextDay.toString()); // Output: 2024-10-27

const previousWeek = plainDate.subtract({ weeks: 1 });
console.log(previousWeek.toString()); // Output: 2024-10-19
            

              
                Copy
              
            
          

Sammenligne datoer:

            const anotherDate = Temporal.PlainDate.from({ year: 2024, month: 11, day: 15 });

if (plainDate.equals(anotherDate)) {
 console.log('Datoene er like');
} else if (plainDate.lessThan(anotherDate)) {
 console.log('plainDate er tidligere enn anotherDate');
} else {
 console.log('plainDate er senere enn anotherDate');
}
// Output: plainDate er tidligere enn anotherDate
            

              
                Copy
              
            
          

Arbeide med PlainTime

Temporal.PlainTime-klassen representerer et klokkeslett uten dato- eller tidssoneinformasjon. Det er nyttig for å representere åpningstider, møtetider eller andre tidsbaserte hendelser.

Opprette en PlainTime:

            const plainTime = Temporal.PlainTime.from({ hour: 14, minute: 30, second: 0 });
console.log(plainTime.toString()); // Output: 14:30:00
            

              
                Copy
              
            
          

Du kan også opprette en PlainTime fra en streng i ISO 8601-format:

            const plainTimeFromString = Temporal.PlainTime.from('09:00:00');
console.log(plainTimeFromString.toString()); // Output: 09:00:00
            

              
                Copy
              
            
          

Få tilgang til tidskomponenter:

            const hour = plainTime.hour;   // 14
const minute = plainTime.minute; // 30
const second = plainTime.second; // 0
const millisecond = plainTime.millisecond; // 0
const microsecond = plainTime.microsecond; // 0
const nanosecond = plainTime.nanosecond;   // 0
            

              
                Copy
              
            
          

Legge til og trekke fra tid:

            const laterTime = plainTime.add({ minutes: 15 });
console.log(laterTime.toString()); // Output: 14:45:00

const earlierTime = plainTime.subtract({ hours: 1 });
console.log(earlierTime.toString()); // Output: 13:30:00
            

              
                Copy
              
            
          

Sammenligne tider:

            const anotherTime = Temporal.PlainTime.from({ hour: 15, minute: 0, second: 0 });

if (plainTime.equals(anotherTime)) {
 console.log('Tidene er like');
} else if (plainTime.lessThan(anotherTime)) {
 console.log('plainTime er tidligere enn anotherTime');
} else {
 console.log('plainTime er senere enn anotherTime');
}
// Output: plainTime er tidligere enn anotherTime
            

              
                Copy
              
            
          

Arbeide med PlainDateTime

Temporal.PlainDateTime-klassen representerer en dato og et klokkeslett uten tidssoneinformasjon. Den kombinerer funksjonaliteten til PlainDate og PlainTime.

Opprette en PlainDateTime:

            const plainDateTime = Temporal.PlainDateTime.from({ year: 2024, month: 10, day: 26, hour: 14, minute: 30, second: 0 });
console.log(plainDateTime.toString()); // Output: 2024-10-26T14:30:00
            

              
                Copy
              
            
          

Du kan også opprette en PlainDateTime fra en streng i ISO 8601-format:

            const plainDateTimeFromString = Temporal.PlainDateTime.from('2024-12-25T09:00:00');
console.log(plainDateTimeFromString.toString()); // Output: 2024-12-25T09:00:00
            

              
                Copy
              
            
          

Få tilgang til dato- og tidskomponenter:

            const year = plainDateTime.year;   // 2024
const month = plainDateTime.month; // 10
const day = plainDateTime.day;     // 26
const hour = plainDateTime.hour;   // 14
const minute = plainDateTime.minute; // 30
const second = plainDateTime.second; // 0
            

              
                Copy
              
            
          

Legge til og trekke fra datoer og klokkeslett:

            const nextDayAndTime = plainDateTime.add({ days: 1, hours: 2 });
console.log(nextDayAndTime.toString()); // Output: 2024-10-27T16:30:00

const previousWeekAndTime = plainDateTime.subtract({ weeks: 1, minutes: 30 });
console.log(previousWeekAndTime.toString()); // Output: 2024-10-19T14:00:00
            

              
                Copy
              
            
          

Konvertere til PlainDate og PlainTime:

            const plainDateFromDateTime = plainDateTime.toPlainDate();
console.log(plainDateFromDateTime.toString()); // Output: 2024-10-26

const plainTimeFromDateTime = plainDateTime.toPlainTime();
console.log(plainTimeFromDateTime.toString()); // Output: 14:30:00
            

              
                Copy
              
            
          

Arbeide med ZonedDateTime

Temporal.ZonedDateTime-klassen representerer en dato og et klokkeslett med en spesifikk tidssone. Dette er avgjørende for applikasjoner som trenger å håndtere datoer og klokkeslett på forskjellige steder rundt om i verden. I motsetning til det utdaterte Date-objektet, gir Temporal innebygd tidssonestøtte.

Opprette en ZonedDateTime:

            const zonedDateTime = Temporal.ZonedDateTime.from({ year: 2024, month: 10, day: 26, hour: 14, minute: 30, second: 0, timeZone: 'America/Los_Angeles' });
console.log(zonedDateTime.toString()); // Output: 2024-10-26T14:30:00-07:00[America/Los_Angeles]
            

              
                Copy
              
            
          

Du kan også opprette en ZonedDateTime fra en Instant og en tidssone:

            const instant = Temporal.Instant.fromEpochSeconds(1666785000); // Eksempel tidsstempel
const zonedDateTimeFromInstant = instant.toZonedDateTimeISO('Europe/London');
console.log(zonedDateTimeFromInstant.toString()); // Utdata vil variere basert på det faktiske øyeblikket, men vil gjenspeile dato/klokkeslett i Europa/London
            

              
                Copy
              
            
          

Få tilgang til dato- og tidskomponenter:

            const year = zonedDateTime.year;   // 2024
const month = zonedDateTime.month; // 10
const day = zonedDateTime.day;     // 26
const hour = zonedDateTime.hour;   // 14
const minute = zonedDateTime.minute; // 30
const second = zonedDateTime.second; // 0
const timeZone = zonedDateTime.timeZone; // Temporal.TimeZone-objekt
            

              
                Copy
              
            
          

Konvertere mellom tidssoner:

            const newYorkDateTime = zonedDateTime.withTimeZone('America/New_York');
console.log(newYorkDateTime.toString()); // Output: 2024-10-26T17:30:00-04:00[America/New_York]
            

              
                Copy
              
            
          

Håndtere sommertid (DST):

Temporal håndterer automatisk DST-overganger. Når du legger til eller trekker fra tid, tar den hensyn til DST, og sikrer nøyaktige resultater. Tenk for eksempel på et møte som er planlagt over DST-overgangen i Tyskland:

            const meetingStart = Temporal.ZonedDateTime.from({ year: 2024, month: 3, day: 31, hour: 2, minute: 30, timeZone: 'Europe/Berlin' });
const meetingEnd = meetingStart.add({ hours: 1 }); // Legge til 1 time
console.log(meetingEnd.toString()); // Output: 2024-03-31T03:30:00+02:00[Europe/Berlin]. Legg merke til at forskyvningen endres på grunn av DST
            

              
                Copy
              
            
          

Arbeide med Instant

Temporal.Instant-klassen representerer et spesifikt tidspunkt, målt i nanosekunder siden Unix-epoken. Det er nyttig for å lagre og sammenligne nøyaktige tidspunkter.

Opprette en Instant:

            const instant = Temporal.Instant.fromEpochSeconds(1666785000); // Eksempel Unix-tidsstempel i sekunder
console.log(instant.toString()); // Utdata vil være en ISO-strengrepresentasjon av det øyeblikket
            

              
                Copy
              
            
          

Konvertere til ZonedDateTime:

            const zonedDateTimeFromInstant = instant.toZonedDateTimeISO('America/Los_Angeles');
console.log(zonedDateTimeFromInstant.toString()); // Output: Dato og klokkeslett i America/Los_Angeles som tilsvarer øyeblikket
            

              
                Copy
              
            
          

Sammenligne øyeblikk:

            const anotherInstant = Temporal.Instant.fromEpochSeconds(1666790000);

if (instant.equals(anotherInstant)) {
 console.log('Øyeblikkene er like');
} else if (instant.lessThan(anotherInstant)) {
 console.log('instant er tidligere enn anotherInstant');
} else {
 console.log('instant er senere enn anotherInstant');
}
// Output: instant er tidligere enn anotherInstant
            

              
                Copy
              
            
          

Arbeide med Duration

Temporal.Duration-klassen representerer en tidsvarighet, for eksempel timer, minutter eller sekunder. Det er nyttig for å beregne forskjellen mellom to datoer eller klokkeslett.

Opprette en Duration:

            const duration = Temporal.Duration.from({ hours: 2, minutes: 30 });
console.log(duration.toString()); // Output: PT2H30M
            

              
                Copy
              
            
          

Beregne forskjellen mellom datoer/klokkeslett:

            const startDate = Temporal.PlainDateTime.from({ year: 2024, month: 1, day: 1, hour: 0, minute: 0, second: 0 });
const endDate = Temporal.PlainDateTime.from({ year: 2024, month: 1, day: 3, hour: 12, minute: 30, second: 0 });
const difference = endDate.since(startDate);
console.log(difference.toString()); // Output: P2DT12H30M

// Få tilgang til komponentene i varigheten
console.log(difference.days);    // 2
console.log(difference.hours);   // 12
console.log(difference.minutes); // 30
            

              
                Copy
              
            
          

Legge til varighet til datoer/klokkeslett:

            const newDate = startDate.add(duration);
console.log(newDate.toString()); // Output: 2024-01-03T02:30:00
            

              
                Copy
              
            
          

Arbeide med kalendere

Temporal API støtter forskjellige kalendersystemer utover den gregorianske kalenderen. Selv om det ikke er fullt implementert i alle polyfills og motorer ennå, er hensikten å tillate applikasjoner å håndtere datoer i kalendere som er spesifikke for forskjellige kulturer. For eksempel, for å bruke den japanske kalenderen (hypotetisk, ettersom implementeringen fortsatt er i utvikling):

            // Dette er et konseptuelt eksempel ettersom kalenderstøtte fortsatt er under utvikling
// const japaneseDate = Temporal.PlainDate.from({ year: 2024, month: 10, day: 26, calendar: 'japanese' });
// console.log(japaneseDate.toString()); // Forventet: Utdata formatert i henhold til den japanske kalenderen

            

              
                Copy
              
            
          

Merk: Kalenderstøtte er en funksjon i utvikling av Temporal API, og full funksjonalitet er ennå ikke universelt tilgjengelig.

Praktiske eksempler og brukstilfeller

Temporal API tilbyr et bredt spekter av muligheter for å håndtere datoer og klokkeslett i JavaScript. Her er noen praktiske eksempler og brukstilfeller:

• Planlegging av avtaler: Opprett en planleggingsapplikasjon som lar brukere bestille avtaler i sin lokale tidssone. Temporal.ZonedDateTime gjør det enkelt å konvertere mellom tidssoner og håndtere DST-overganger. For en klinikk i Berlin som planlegger avtaler globalt:

            const appointmentTimeBerlin = Temporal.ZonedDateTime.from({ year: 2024, month: 11, day: 5, hour: 10, minute: 0, timeZone: 'Europe/Berlin' });
const appointmentTimeLA = appointmentTimeBerlin.withTimeZone('America/Los_Angeles');
console.log(`Avtaletid i Berlin: ${appointmentTimeBerlin.toString()}`);
console.log(`Avtaletid i Los Angeles: ${appointmentTimeLA.toString()}`);
            

              
                Copy
              
            
          

• Beregne alder: Bestem alderen til en bruker basert på fødselsdatoen deres. PlainDate lar deg representere fødselsdatoen uten tidssoneinformasjon.

            const birthDate = Temporal.PlainDate.from({ year: 1990, month: 5, day: 15 });
const today = Temporal.Now.plainDateISO();
const age = today.year - birthDate.year - (today.month < birthDate.month || (today.month === birthDate.month && today.day < birthDate.day) ? 1 : 0);
console.log(`Alder: ${age}`);
            

              
                Copy
              
            
          

• Vise datoer og klokkeslett i forskjellige formater: Formater datoer og klokkeslett i henhold til brukerens lokale innstillinger. Mens internasjonaliseringsfunksjoner (Intl) er separate, kan Temporal-objekter enkelt formateres ved hjelp av toLocaleString() eller lignende metoder når de kombineres med Intl API-funksjoner.

            const zonedDateTimeNow = Temporal.Now.zonedDateTimeISO('en-GB');
console.log(zonedDateTimeNow.toLocaleString('en-GB'));
console.log(zonedDateTimeNow.toLocaleString('de-DE'));
            

              
                Copy
              
            
          

• Spore hendelsesvarigheter: Beregn varigheten av en hendelse og vis den i et menneskelig lesbart format. Varighet lar deg representere tidsforskjellen mellom to datoer eller klokkeslett.

            const eventStart = Temporal.Instant.fromEpochSeconds(1700000000); // Eksempel starttidsstempel
const eventEnd = Temporal.Instant.fromEpochSeconds(1700005000);   // Eksempel slutttidsstempel
const durationOfEvent = eventEnd.since(eventStart);
console.log(`Hendelsesvarighet: ${durationOfEvent.minutes} minutter`);
            

              
                Copy
              
            
          

Beste fremgangsmåter for bruk av Temporal API

Her er noen beste fremgangsmåter å huske på når du bruker Temporal API:

• Bruk uforanderlighet: Omfavn uforanderligheten til Temporal-objekter. Unngå å endre objekter direkte. Opprett i stedet nye objekter ved hjelp av metoder som add, subtract og with.
• Håndter tidssoner nøye: Vær oppmerksom på tidssoner når du jobber med datoer og klokkeslett. Bruk ZonedDateTime når du trenger å representere datoer og klokkeslett i en spesifikk tidssone.
• Bruk tydelige variabelnavn: Bruk beskrivende variabelnavn som tydelig indikerer typen Temporal-objekt som brukes (f.eks. plainDate, zonedDateTime, duration).
• Vurder Polyfills: Fordi Temporal fortsatt er relativt nytt, sørg for tilstrekkelig støtte ved å bruke et polyfill-bibliotek der det er nødvendig.
• Valider inndata: Valider alltid brukerinndata for å sikre at datoer og klokkeslett er i riktig format.

Migrering fra utdatert dato

Migrering fra det utdaterte Date-objektet kan være en gradvis prosess. Vurder disse strategiene:

• Trinnvis adopsjon: Begynn med å bruke Temporal i ny kode mens du opprettholder Date i eksisterende deler av applikasjonen din.
• Wrapper-funksjoner: Opprett wrapper-funksjoner som konverterer mellom Date- og Temporal-objekter for å lette interoperabilitet under migreringen.
• Grundig testing: Test migreringen grundig for å sikre at alle dato- og tidsberegninger er nøyaktige.

Temporal API vs. Moment.js

Moment.js var et populært bibliotek for dato- og tidsmanipulasjon i JavaScript, men det anses nå som et utdatert prosjekt og er i vedlikeholdsmodus. Temporal API gir en mer moderne og standardisert løsning som adresserer mange av manglene ved Moment.js. Moment.js er mutabel og mangler innebygd tidssonestøtte. Temporal API er uforanderlig og har innebygd tidssonestøtte.

Konklusjon

JavaScript Temporal API representerer en betydelig forbedring i forhold til det utdaterte Date-objektet. Dets uforanderlighet, klare API, tidssonestøtte og kalenderstøtte gjør det til et kraftig verktøy for å håndtere datoer og klokkeslett i moderne JavaScript-applikasjoner. Mens adopsjonen fortsatt vokser, lar bruk av en polyfill deg begynne å utnytte fordelene i dag. Etter hvert som API-et blir mer utbredt støttet, forventes det å bli standardmåten å jobbe med datoer og klokkeslett i JavaScript.

Omfavn Temporal API og lås opp en mer effektiv og pålitelig måte å administrere datoer og klokkeslett i prosjektene dine, og sørg for at applikasjonen din håndterer globale tidssoner og beregninger nøyaktig.